<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>导出/查看记录</title>
    <!--jquery-->
    <script src="{{ url_for('static', filename='common/jquery-3.6.0.min.js') }}"></script>
    <!--bootstrap-->
    <script src="{{ url_for('static', filename='common/bootstrap/bootstrap.bundle.min.js') }}"></script>
    <script src="{{ url_for('static', filename='common/bootstrap/bootstrap.min.js') }}"></script>
    <link rel="stylesheet" type="text/css"
          href="{{ url_for('static', filename='common/bootstrap/bootstrap.min.css') }}">
    <!--页面css-->
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='select/select.css') }}">
    <script>
        $(document).ready(function () {

            // 时间格式校验
            function date_limit(time) {
                const limit = /^(?:19|20)[0-9][0-9]-(?:(?:0[1-9])|(?:1[0-2]))-(?:(?:[0-2][1-9])|(?:[1-3][0-1])) (?:(?:[0-2][0-3])|(?:[0-1][0-9])):[0-5][0-9]:[0-5][0-9]$/
                console.log(limit.test(time))
                return limit.test(time);
            }

            // 选择功能
            $('.b1 button').click(function () {
                let name = $(this).attr('id')
                $('.b2 > div').hide()
                $('div .' + name).show()
            })

            //点击大类后显示小类数据
            $(document).on('click', '.title-1', function () {
                let a = $(this).html()
                $.ajax({
                    url: "{{ url_for('select.return_smallname') }}",
                    type: 'post',
                    data: {'a': a},
                    success: function (data) {
                        $('.table1').html(data)
                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            // 点击小类或通过输入框跳转后显示详细数据的函数
            function show_detail(big, small) {
                $.ajax({
                    url: "{{ url_for('select.return_smallname_details') }}",
                    type: 'post',
                    data: {'bigname': big, 'smallname': small},
                    success: function (data) {
                        //通过输入框跳转的时候如果输入错误，后端返回1或2
                        if (data === '1') {
                            $('.tips').html(alert_box(1, '您要找的大类不存在'))
                            return
                        }
                        if (data === '2') {
                            $('.tips').html(alert_box(1, '您要找的小类不存在'))
                            return
                        }
                        $('.table1').html(data)

                        $(document).ready(function () {
                            // 自动填入大类，小类，日期
                            // 生成日期和时间
                            let myDate = new Date()
                            let year = myDate.getFullYear()
                            let month = myDate.getMonth() + 1
                            let day = myDate.getDate()

                            month = month > 9 ? month : "0" + month
                            day = day > 9 ? day : "0" + day

                            let hour = myDate.getHours()
                            let minute = myDate.getMinutes()
                            let second = myDate.getSeconds()

                            // js返回的是9而不是09，所以价格零
                            hour = hour > 9 ? hour : "0" + hour
                            minute = minute > 9 ? minute : "0" + minute
                            second = second > 9 ? second : "0" + second

                            let date = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second
                            let temp1 = year + '-' + month + '-' + day
                            let temp2 = hour + ':' + minute + ':' + second

                            let big = $('.big3').html()
                            let small = $('.small3').html()
                            let unitprice = $('.unitprice3').html()
                            let rowid = $('.rowid3').html()

                            $('#a1').attr("value", temp1)
                            $('#a1-1').attr("value", temp2)
                            $('#a2').attr("value", big)
                            $('#a3').attr("value", small)
                            $('#a6').attr("value", unitprice)

                            $('#b1').attr("value", temp1)
                            $('#b1-1').attr("value", temp2)
                            $('#b2').attr("value", big)
                            $('#b3').attr("value", small)
                        })

                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })

            }

            //点击小类后显示小类详细数据
            $(document).on('click', '.title-2', function () {
                let big = $(this).attr('name')
                let small = $(this).html()
                show_detail(big, small)
            })

            // 从小类细节页面返回小类
            $(document).on('click', '#smallname_show', function () {
                let title = $('.total_bigname').html()

                // 如果当前页面不是小类详细页面，予以提示
                if (title === undefined) {
                    $('.tips').html(alert_box(1, '您当前不在小类详细页面中，无法返回小类页面'))
                    return
                }
                let a = $('.big3').html()
                $.ajax({
                    url: "{{ url_for('select.return_smallname') }}",
                    type: 'post',
                    data: {'a': a},
                    success: function (data) {
                        $('.table1').html(data)
                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            // 从小类页面返回大类
            $(document).on('click', '#bigname_show', function () {
                $.ajax({
                    url: "{{ url_for('select.small_to_big') }}",
                    type: 'post',
                    success: function (data) {
                        $('.table1').html(data)
                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            //零件入库
            $('#btn1').click(function () {
                let temp1 = $('#a1').val()
                let temp2 = $('#a1-1').val()
                let a = temp1 + ' ' + temp2
                let b = $('#a2').val()
                let c = $('#a3').val()
                let d = $('#a4').val()
                let e = $('#a5').val()
                let f = $('#a6').val()

                if (date_limit(a) === false) {
                    $('.tips').html(alert_box(1, '日期或时间格式不正确'))
                    return
                }
                // 防止某些信息未填
                if (temp1 === '' || temp2 === '' || a === '' || b === '' || c === '' || d === '' || e === '' || f === '') {
                    $('.tips').html(alert_box(1, '您尚有信息未填写'))
                    return
                }
                $.ajax({
                    url: "{{ url_for('select.add') }}",
                    type: 'post',
                    data: {
                        'a': a,
                        'b': b,
                        'c': c,
                        'd': d,
                        'e': e,
                        'f': f
                    },
                    success: function (data) {
                        if (data === '1') {
                            $('.tips').html(alert_box(1, '要添加的大类或者小类不存在'))
                            return
                        }
                        if (data === '2') {
                            $('.tips').html(alert_box(3, '零件添加成功'))
                            show_detail(b, c)
                        }

                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            //零件领用
            $('#btn2').click(function () {
                let temp1 = $('#b1').val()
                let temp2 = $('#b1-1').val()
                let a = temp1 + ' ' + temp2
                let b = $('#b2').val()
                let c = $('#b3').val()
                let d = $('#b4').val()
                let e = $('#b5').val()
                if (date_limit(a) === false) {
                    $('.tips').html(alert_box(1, '日期或时间格式不正确'))
                    return
                }
                // 防止某些信息未填
                if (temp1 === '' || temp2 === '' || a === '' || b === '' || c === '' || d === '' || e === '') {
                    $('.tips').html(alert_box(1, '您尚有信息未填写'))
                    return
                }
                $.ajax({
                    url: "{{ url_for('select.reduce') }}",
                    type: 'post',
                    data: {
                        'a': a,
                        'b': b,
                        'c': c,
                        'd': d,
                        'e': e
                    },
                    success: function (data) {
                        if (data === '1') {
                            $('.tips').html(alert_box(1, '要添加的大类或者小类不存在'))
                            return
                        }
                        if (data === '2') {
                            $('.tips').html(alert_box(2, '领用数量超过仓库目前现有库存'))
                            return
                        }
                        if (data === '3') {
                            $('.tips').html(alert_box(3, '零件领用成功'))
                            show_detail(b, c)
                        }
                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            //点击按钮将记录显示在记录修改区域
            $(document).on('click', '#button1', function () {
                // 取到本条纪录的行号
                let num = $(this).attr('name')

                //b = $(".t1").find("tr td[name=" + name + "]").each(function(){
                //    cmy.append($(this).html())
                //});

                // 取到本条纪录的全部内容
                let temp = $(".table1").find("tr[name=" + num + "] > td")

                // 修改栏提示选中的是哪一条记录
                $('#c0').html(temp.eq(0).text())
                // 删除栏提示选中的是哪一条记录
                $('#d0').html(temp.eq(0).text())
                // rowid
                $('#d0').attr('name1', num)
                // bigname
                $('#d0').attr('name2', temp.eq(2).html())
                // smallname
                $('#d0').attr('name3', temp.eq(3).html())


                let date = temp.eq(1).html()
                // 日期
                let time1 = date.split(' ')[0]
                // 时间
                let time2 = date.split(' ')[1]
                {#let time = temp.eq(2).html()#}
                let bigname = temp.eq(2).html()
                let smallname = temp.eq(3).html()
                let handle = temp.eq(4).html()
                let change = temp.eq(5).html()
                let unitprice = temp.eq(6).html()

                // 清理输入框中的原始数据
                $('#c1').val(time1)
                $('#c1-1').val(time2)
                $('#c2').val(bigname)
                $('#c3').val(smallname)
                $('#c4').val(handle)
                $('#c5').val(change)
                $('#c6').val(unitprice)

                $('#c1').attr('rowid', num)
                // 如果变化数量出现了正负号的改变，弹窗提示
                $('#c5').attr('value', change)
                // 如果出库记录的零件单价被修改，弹窗提示
                $('#c6').attr('value', unitprice)
            })

            //提交修改后的记录
            $('#btn3').click(function () {
                // 获取目前最新记录的单价和行号
                //let last_unitprice = $('.unitprice3').html()
                //获取最新记录的rowid，判断要修改的记录是否是最新的数据
                let last_rowid = $('.rowid3').html()

                // 获取该条记录的信息
                let rowid = $('#c1').attr('rowid')
                // 将时间和日期组合起来
                let temp11 = $('#c1').val()
                let temp12 = $('#c1-1').val()
                let date = temp11 + ' ' + temp12

                let bigname = $('#c2').val()
                let smallname = $('#c3').val()
                let handle = $('#c4').val()
                let change = $('#c5').val()
                let unitprice = $('#c6').val()

                // 未修改之前的增减情况 旧change
                let temp = $('#c5').attr('value')
                // 未修改之前的价格 旧unitprice
                let temp1 = $('#c6').attr('value')

                if (date_limit(date) === false) {
                    $('.tips').html(alert_box(1, '日期或时间格式不正确'))
                    return
                }
                // 防止某些信息未填
                if (date === '' || bigname === '' || smallname === '' || handle === '' || change === '' || unitprice === '') {
                    $('.tips').html(alert_box(1, '您尚有信息未填写'))
                    return
                }

                let temp5 = parseFloat(change)
                let temp6 = parseFloat(temp)

                // 两种情况
                //入库记录，改变价格    通过
                //出库记录，改变价格    禁止

                // 如果提交的是领用记录且价格被修改
                if (temp5 < 0 && temp1 !== unitprice) {
                    $('.tips').html(alert_box(1, '您提交的记录为领用记录，您无需修改单价，领用记录的单价会自动修改'))
                    return
                }

                // 获取目前的零件数目，防止修改后的领用记录超过了在库数目
                //已经在后端实现

                // 如果出现了正负号的转变，进行提示
                if ((temp5 < 0 && temp6 > 0) || (temp5 > 0 && temp6 < 0)) {
                    if (confirm('您正在将入库记录改为领用记录，或是将领用记录改为入库记录，请确认操作正确') === false) {
                        return
                    }
                }

                // 如果修改的是最新记录的价格，则会导致该零件的在库价值发生改变，进行提示
                if ((rowid === last_rowid) && (temp1 !== unitprice)) {
                    if (confirm('您修改了最新记录的价格，会导致该零件库存价值改变，请再次确认') === false) {
                        return
                    }
                }

                $.ajax({
                    url: "{{ url_for('select.modify') }}",
                    type: 'post',
                    data: {
                        'a': date,
                        'b': bigname,
                        'c': smallname,
                        'd': handle,
                        'e': change,
                        'f': unitprice,
                        'g': rowid
                    },
                    success: function (data) {
                        if (data === '1') {
                            $('.tips').html(alert_box(1, '修改后的记录会导致库存数量某一时刻为零'))
                            return
                        }
                        if (data === '2') {
                            $('.tips').html(alert_box(3, '修改成功'))
                            show_detail(bigname, smallname)
                        }
                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            //记录删除
            $('#btn4').click(function () {
                if ($('#d0').html() === '') {
                    $('.tips').html(alert_box(1, '您尚未选择要删除的记录'))
                    return
                }
                let rowid = $('#d0').attr('name1')
                let bigname = $('#d0').attr('name2')
                let smallname = $('#d0').attr('name3')
                if (rowid === undefined || rowid === '') {
                    $('.tips').html(alert_box(1, '您尚未选择要删除的记录'))
                    return
                }
                $.ajax({
                    url: "{{ url_for('select.delete') }}",
                    type: 'post',
                    data: {
                        'a': rowid,
                        'b': bigname,
                        'c': smallname
                    },
                    success: function (data) {
                        if (data === '1') {
                            $('.tips').html(alert_box(3, '删除成功'))
                            $('#d0').html('')
                            show_detail(bigname, smallname)
                            return
                        }
                        if (data === '2') {
                            $('.tips').html(alert_box(1, '修改后的记录会导致库存数量某一时刻为零'))
                        }
                    },
                    error: function () {
                        $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                    }
                })
            })

            //下拉框预测模式
            $("#smallname_forecast").focus(function () {
                $(this).keyup(function (e) {
                    if (e.which === 13) {

                        let smallname = $("#smallname_forecast").val().trim()
                        if (smallname === '') {
                            return
                        }
                        $.ajax({
                            url: "{{ url_for('select.smallname_forecast') }}",
                            type: 'post',
                            data: {
                                'a': smallname,
                            },
                            success: function (data) {
                                $('.forecast').html(data)
                            },
                            error: function () {
                                $('.tips').html(alert_box(1, '系统故障，请刷新重试，若无效请联系管理员'))
                            }
                        })

                    }
                })
            });

            //页面跳转
            $('#btn5').click(function () {
                let name = $("#smallname_forecast").val().trim()
                if (name === '') {
                    $('.tips').html(alert_box(1, '您没有输入任何内容'))
                    return
                }
                let big = name.split(' ')[0]
                let small = name.split(' ')[1]

                show_detail(big, small)
            })
        });
    </script>
</head>
<body>
{% include 'login/bar.html' %}
<header>
<div class="header_title" style="text-align: center">
        <h1 style="color: #646464">零件增减模块</h1>
    </div>
</header>
<!--第一部分，一般零件-->
<main>
    <stateless_part>
        <right>
            <!--页面右侧-->

            <!--选择框-->
            <div class="b1">
                <div class="btn-group" role="group" aria-label="Basic example"
                     style="width: 100%;margin-bottom: 20px">
                    <button type="button" class="btn btn-outline-success" id="block1">零件入库</button>
                    <button type="button" class="btn btn-outline-success" id="block2">零件领用</button>

                </div>
                <div class="btn-group" role="group" aria-label="Basic example"
                     style="width: 100%;margin-bottom: 20px">
                    <button type="button" class="btn btn-outline-dark" id="block3">修改记录</button>
                    <button type="button" class="btn btn-outline-danger" id="block4">删除记录</button>
                </div>
            </div>


            <!--显示部分-->
            <div class="b2">
                <!--零件入库 点入哪个小类中后就把目前的日期，小类，大类预填入空格中-->
                <div class="block1">
                    <h4>零件入库</h4>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">日期</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a1" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">时间</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a1-1" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">大类名称</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a2" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">小类名称</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a3" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">操作方</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a4" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">数量</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a5" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">单价</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="a6" autocomplete="new-complete">
                    </div>
{#                    <div style="margin-top: 20px">#}
{#                        <button type="button" class="btn btn-outline-dark" id="btn1" style="width: 100%">提交</button>#}
{#                    </div>#}
                </div>

                <!--零件领用-->
                <div class="block2" style="display: none">
                    <h4>零件领用</h4>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">日期</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="b1" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">时间</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="b1-1" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">大类名称</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="b2" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">小类名称</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="b3" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">操作方</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="b4" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">数量</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="b5" autocomplete="new-complete">
                    </div>
{#                    <div style="margin-top: 20px">#}
{#                        <button type="button" class="btn btn-outline-dark" id="btn2" style="width: 100%">提交</button>#}
{#                    </div>#}
                </div>

                <!--修改记录 其实相当于删除后重新创建-->
                <div class="block3" style="display: none">
                    <h4>修改记录</h4>
                    <p>您要修改的记录的序号是：<span id="c0"></span></p>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">日期</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c1" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">时间</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c1-1" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">大类名称</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c2" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">小类名称</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c3" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">操作方</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c4" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">数量</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c5" autocomplete="new-complete">
                    </div>
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="inputGroup-sizing-default">单价</span>
                        </div>
                        <input type="text" class="form-control" aria-label="Sizing example input"
                               aria-describedby="inputGroup-sizing-default" id="c6" autocomplete="new-complete">
                    </div>
{#                    <div style="margin-top: 20px">#}
{#                        <button type="button" class="btn btn-outline-dark" id="btn3" style="width: 100%">提交</button>#}
{#                    </div>#}
                </div>

                <!--删除记录-->
                <div class="block4" style="display: none">
                    <h4>删除记录</h4>
                    <!--大类和小类必须同时创建，个数需要另外写入-->
                    <p>您将要删除的记录序号是：<span id="d0"></span></p>
{#                    <div style="margin-top: 20px">#}
{#                        <button type="button" class="btn btn-outline-dark" id="btn4" style="width: 100%">提交</button>#}
{#                    </div>#}
                </div>
            </div>
        </right>
        <left>
            <!--页面左侧-->
            <h2>无状态零件区域</h2>
            <br>
            <div class="input-group">
                <div class="input-group-prepend">
                    <span class="input-group-text">小类名称</span>
                </div>
                <input type="text" aria-label="First name" class="form-control" list="forecast" id="smallname_forecast"
                        autocomplete="new-complete">
                <button class="btn btn-outline-success" type="submit" id="btn5">跳转</button>
                <button class="btn btn-outline-success" type="submit" id="bigname_show">返回大类</button>
                <button class="btn btn-outline-success" type="submit" id="smallname_show">返回小类</button>
            </div>
            <br>

            <div class="forecast">
                {% include 'select/smallname_forecast.html' %}
            </div>
            <!--存放图表的区域-->
            <div class="stateless_table">
                <!--table标签被直接写入各个表格中了-->
                <div class="table1">
                    {#                <table class="t1">#}

                    <!--表格内容区-->
                    {% include 'select/bigname_table.html' %}

                    {#                </table>#}
                </div>
            </div>
        </left>
        <div style="clear: both;"></div>
    </stateless_part>
</main>
<!--使用定制好的解释框样式-->
{% include 'common/common.html' %}
</body>
</html>